博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
加载静态文件,父模板的继承和扩展
阅读量:5937 次
发布时间:2019-06-19

本文共 5083 字,大约阅读时间需要 16 分钟。

  1. 用url_for加载静态文件
    1. <script src="{
      { url_for('static',filename='js/login.js') }}"></script>
    2. flask 从static文件夹开始寻找
    3. 可用于加载css, js, image文件
  2. 继承和扩展
    1. 把一些公共的代码放在父模板中,避免每个模板写同样的内容。base.html
    2. 子模板继承父模板
      1.   {% extends 'base.html’ %}
    3. 父模板提前定义好子模板可以实现一些自己需求的位置及名称。block
      1. <title>{% block title %}{% endblock %}-MIS问答平台</title>
      2. {% block head %}{% endblock %}
      3. {% block main %}{% endblock %}
    4. 子模板中写代码实现自己的需求。block
      1.   {% block title %}登录{% endblock %}
  3. 首页、登录页、注册页都按上述步骤改写。

 

from flask import Flask,render_templateapp = Flask(__name__)@app.route('/')def shouye():    return render_template('shouye.html')@app.route('/denglu/')def denglu():    return render_template('denglu.html')@app.route('/zhuce/')def zhuce():    return render_template('zhuce.html')if __name__ == '__main__':    app.run()
    
{% block title %} 爱奇艺 {% endblock %}
{% block js %}{% endblock %}

{% block jiemian %}
推荐
{% endblock %}
{% extends'shouye.html' %}{% block title %}用户登录{% endblock %}{% block js %} {% endblock %}{% block jiemian %}
用户名
密码
普通用户
VIP用户
{% endblock %}
{% extends'shouye.html' %}{% block title %}用户注册{% endblock %}{% block js %} {% endblock %}{% block jiemian %}
用户昵称
输入密码
确认密码
普通用户
VIP用户
{% endblock %}
function myLogin() {
var one=document.getElementById("un"); var two=document.getElementById("pw"); var three=document.getElementById("error_box"); var four=document.getElementById("tpw"); if(two.value.length<6){ three.innerHTML="为了账号安全,请输入6个以上的密码!"; return } else if((one.value.charCodeAt(0)>=48)&&one.value.charCodeAt(0)<=57){
three.innerHTML="账号首个不能为数字!"; return } else if (two.value!=four.value){
three.innerHTML="输入密码不一致!请重新输入!"; return } else for(var i=1;i
57)&&(one.value.charCodeAt(i)<97||one.value.charCodeAt(i)>122)){ three.innerHTML="账号只能为数字!"; return } } if(one.value.length<6){
three.innerHTML="账号需为6-12个长度!"; return } window.alert("登录成功!") }
function myLogin() {            var one=document.getElementById("un");            var two=document.getElementById("pw");            var three=document.getElementById("error_box");            if(two.value.length<6){                three.innerHTML="为了账号安全,请输入6个以上的密码!";                return            }              else if((one.value.charCodeAt(0)>=48)&&one.value.charCodeAt(0)<=57){                three.innerHTML="账号首个不能为数字!";                return            }            else for(var i=1;i
57)&&(one.value.charCodeAt(i)<97||one.value.charCodeAt(i)>122)){ three.innerHTML="账号只能为数字!"; return } } if(one.value.length<6){ three.innerHTML="账号需为6-12个长度!"; return } window.alert("登录成功!") }
img{
width: 300px; height: 200px;}.img{
border:1px solid skyblue; width: 300px; height: 250px; float: left; margin: 5px;}.img img{
width:100%; height: 85%;}.desc{
text-align:center; padding: 5px;}.img:hover{
border: 1px solid blue;}p{
color:fuchsia;}.kk{
color:darkcyan;font-weight: bold;font-style: italic;font-size: 20px;}#abc{
color: darkblue;text-decoration: underline;font-size: 25px;}.aaa img{
height:50px; width:50px;}

 

转载于:https://www.cnblogs.com/1996liuda/p/7798276.html

你可能感兴趣的文章
Java并发专题 带返回结果的批量任务运行 CompletionService ExecutorService.invokeAll
查看>>
10行Python代码解决约瑟夫环(模拟)
查看>>
一个简单好用的日志框架NLog
查看>>
超级硬盘数据恢复软件 4.6.5.0注冊码破解版
查看>>
一款基于jquery和css3实现的摩天轮式分享按钮
查看>>
Android创建启动画面
查看>>
Linux中date命令的各种实用方法--转载
查看>>
mysqld -install命令时出现install/remove of the service denied错误的原因和解决办法
查看>>
苹果企业版帐号申请记录
查看>>
C++ Error: error LNK2019: unresolved external symbol
查看>>
Bitmap 和Drawable 的区别
查看>>
Java操作mongoDB2.6的常见API使用方法
查看>>
如何给服务器设置邮件警报。
查看>>
CEF js调用C#封装类含注释
查看>>
麦克劳林
查看>>
Eclipse SVN修改用户名和密码
查看>>
架构师的职责都有哪些?
查看>>
SVN: bdb: BDB1538 Program version 5.3 doesn't match environment version 4.7
查看>>
jsp内置对象作业3-application用户注册
查看>>
android115 自定义控件
查看>>